<template>
    <div>
        <Modal v-model="modal" class="modal-full" title="原始数据" width=1200>
            <div v-if="modalShow">
                <Tabs @on-click="tabClick" v-if="dataLoad">
                    <Tab-pane v-for="(item,index) in dataModel" :label="item.sheet_name" :key="index">
                        <grid-panel :ref="'table-'+index" class="table-mark" :model="item" :hasCheck="false" :has-search="false" :rowCheckMode="true" v-if="tabIsLoad[index]"></grid-panel>
                    </Tab-pane>
                </Tabs>
            </div>
            <div slot="footer" class="button-panel-button">
                <i-button @click="actionWork" type="primary">处理数据</i-button>
                <i-button @click="close">取消</i-button>
            </div>
        </Modal>
    </div>
</template>

<script>
import Base from '../modalBase'
import $ from '@/common'
import gridPanel from '@/node/gridPanel'
//测试用model
export default {
    extends: Base,
    props: {
        open: {},
        actionModel: {},
        isLoad: {
            defalut: false
        }
    },
    data() {
        return {
            path: {
                tpl: 'service/{app}/excel/ds/{id}',
                dss: '/service/{app}/imp/dss',
                data: '/service/{app}/imp/data/original'
            },
            modal: false,
            tabIsLoad: {},
            tplDataList: {},
            sheets: [],
            tplMap: {},
            dataModel: {},
            dataLoad: false,
            hasMap: false
        }
    },
    computed: {
        tplData() {
            return this.tplDataList[this.actionData.excel_ds_id]
        }
    },
    watch: {
        open(v) {
            this.modal = v
        },
        modal(v) {
            this.$emit('update:open', v)
        }
    },
    created() {
    },
    methods: {
        load() {
            this.dataLoad = false
            this.getTplData(this.actionData.excel_ds_id).then(() => {
                this.sheets = this.tplData.sheet_name.split(';')
                this.dataModel = {}
                this.tabIsLoad = {}
                this.tplData.fields.forEach((field) => {
                    var entity_code = field.entity_code
                    var sheet_name = field.sheet_name

                    if (!this.dataModel[sheet_name]) {
                        this.tabIsLoad[sheet_name] = false
                        this.dataModel[sheet_name] = {
                            entity_name: field.entity_name,
                            entity_code,
                            sheet_name,
                            path: this.path.data,
                            fields: [],
                            extPost: {
                                batch_id: this.actionData.id,
                                excel_ds_id: this.actionData.excel_ds_id,
                                sheet_name
                            }
                        }
                    }
                    this.dataModel[sheet_name].fields.push({
                        name: field.name,
                        code: `${entity_code}_${field.field_code}`,
                        type: field.type
                    })
                })
                for (let i in this.dataModel) {
                    this.tabIsLoad[i] = true
                    break
                }
                this.dataLoad = true
            })
        },
        //处理数据
        actionWork() {
            this.$parent.$parent.actionTrigger({
                code: 'work',
                data: this.actionData.id,
                row: this.actionData
            }).then(() => {
                this.close()
            })
        },
        getTplData(id) {
            if (this.tplDataList[id]) {
                return new Promise((resolve) => {
                    resolve(this.tplDataList[id])
                })
            } else {
                return $.link(this.path.tpl, null, {
                    param: {
                        id
                    }
                }).then((res) => {
                    this.$set(this.tplDataList, id, res.data)
                })
            }
        },
        tabClick: function(index) {
            if (!this.tabIsLoad[this.sheets[index]]) {
                this.$set(this.tabIsLoad, this.sheets[index], true)
                this.$forceUpdate()
            }
        }
    },
    components: {
        gridPanel
    }
}
</script>

<style lang="less">
.ivu-modal-body {
    .ivu-tabs-content {
        margin-top: -8px;
    }
}
</style>
